<template>
  <div o-Container>
    <div class="top_box">
      <div class="search_box">
        <img src="/static/skin/herodoo/main/platform/home/img/search.png" alt="">
        <input :value="searchValue" type="text" placeholder="请输入搜索内容" @keydown.enter="searchEnterKeyPress"
          @blur="searchEnterKeyPress">
      </div>
      <div class="button_box">
        <button @click="addNew()">新建投票</button>
      </div>
    </div>
    <o-list v-bind:source="list.contract">
      <template slot="config" slot-scope="scope">
        <div class="img_box">
          <el-tooltip class="item" effect="dark" content="查看" placement="bottom">
            <img @click="look(scope)" src="/static/skin/default/MCS/AIGC/Inventory/images/chakan.png" alt="">
          </el-tooltip>

          <el-tooltip class="item" effect="dark" content="编辑" placement="bottom">
            <img :class="{ is_opacity: scope.data.row.IsRelease }" @click="edit(scope)"
              src="/static/skin/default/MCS/AIGC/Inventory/images/bianji.png" alt="">
          </el-tooltip>

          <el-tooltip class="item" effect="dark" content="删除" placement="bottom">
            <img :class="{ is_opacity: scope.data.row.IsRelease }" @click="del(scope)"
              src="/static/skin/default/MCS/AIGC/Inventory/images/shanchu.png" alt="">
          </el-tooltip>

        </div>
      </template>
    </o-list>
    <EditType ref="editType" @reload="reload"></EditType>
    <Examine ref="examine" @reload="reload"></Examine>
  </div>
</template>

<script>
import EditType from "./Components/editType.vue"
import Examine from "./Components/examine.vue"
export default {
  components: {
    EditType,
    Examine
  },
  name: "mms_platform_company_list", /* 这个name暂时不知道用啥用，根据官方文档说的是方便排错的 */
  data() {
    return {
      octopus: this.$parent.octopus,
      list: {
        contract: {
          data: {
            id: 1349, // 菜单表的八爪鱼ID
            cellData: [
              { name: "ID" },	// ID
              { name: "Name" },	// 投票标题
              { name: "Description" },	// 投票说明
              { name: "StatusName" },	// 状态
              { name: "IsReleaseName" },	// 是否发布
              { name: "IsTopName" },	// 是否置顶
              { name: "IsMultipleChoice", show: false },	// 是否允许多选
              { name: "IsMultipleChoiceName" },	// 是否多选（0单选  1多选）
              { name: "IsRelease", show: false },	// 是否发布
              { name: "IsTop", show: false },	// 是否置顶
              { name: "PicturePath" },	// 图片
              { name: "Status", show: false },	// 状态
              { name: "VoteOptionTypeIDName" },	// 投票选项内容
              { name: "VoteTypeIDName" },	// 投票结果展示
              { name: "OptionNumber" },	// 可选数量
              { name: "VoteOptionTypeID", show: false },	// 投票选项内容
              { name: "VoteTypeID", show: false },	// 投票结果展示
              { name: "StartTime" },	// 投票开始时间
              { name: "EndTime" },	// 投票结束时间
              { name: "PvCount" },	// 浏览量
              { name: "CreateTime" },	// 操作时间
              { name: "CreateUserID" },	// 操作人
            ],
          },
          configWidth: 90,
          showNumber: true,
        },
      },
      isEdit: false
    }
  },
  created() {
    // this.init()
  },
  methods: {
    // init() {
    //   const data = this.list.contract.data;
    //   const company = this.octopus.passport.authorization.company
    //   data.paramData.CompanyID = company == 1 ? 'NULL' : company
    // },
    addNew() {
      this.$refs.editType.drawerOpen(null, 'CREATE')
    },
    look(row) {
      this.$refs.examine.drawerOpen(row.data.row, 'look');
    },
    edit(row) {
      if (row.data.row.IsRelease) {
        return
      }
      this.$refs.editType.drawerOpen(row.data.row, 'UPDATE')
    },
    del(row) {
      if (row.data.row.IsRelease) {
        return
      }
      this.$confirm(`确定删除这个主题类型吗?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        // type: 'warning'
        center: true
      }).then(res => {
        this.api_1345(row.data.row.ID)
      }).catch(() => {
        console.log('取消了');
      })
    },
    api_1345(ID) {
      this.octopus.request.api.post("/Octopus/Engine/Item", {
        id: 1345, // 菜单表的八爪鱼ID
        type: "DELETE",
        value: ID,
      },
        // 处理回调事件，通过分析data.status.code的状态来实现。
        (data) => {
          if (data.status.code === 200) {
            this.list.contract.control.load();
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          } else {
            this.octopus.tips.error(data);
          }
        }
      );
    },
    reload() {
      this.list.contract.control.load();
    }
  },
  props: ["oData"]
}
</script>
<style scoped>
.top_box {
  width: 100%;
  height: 5.3rem;
  display: flex;
  justify-content: space-between;
  margin-top: 2rem;
  padding-bottom: 1.2rem;
  box-sizing: border-box;
}

.top_box .search_box {
  width: 32rem;
  height: 100%;
  border: 1px solid #F0F0F0;
  border-radius: 4rem;
  display: flex;
  justify-content: space-between;
  padding: 0 .8rem;
  box-sizing: border-box;
}

.top_box .search_box input {
  border: none;
  outline: none;
  width: 70%;
}

.top_box .search_box img {
  cursor: pointer;
}

.top_box .button_box button {
  width: 15rem;
  height: 100%;
  border-radius: 4rem;
  border: none;
  color: #fff;
  background-color: #F78C52;
  box-shadow: 0px -3px 4px 0px rgba(204, 190, 186, 0.4);
  font-size: 1.7rem;
  cursor: pointer;
}

.top_box .button_box button {
  margin-right: 1.3rem;
}

.el-message-box {
  background-color: #fff !important;
}

.img_box {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.img_box img {
  width: 25px;
  cursor: pointer;
}

.is_opacity {
  opacity: 0.5;
}

>>>.Content {
  height: 84vh !important;
}
</style>